<template>
	<view class="content">
		<nav-bar :isBack="true" title="API" background="#fff"></nav-bar>
		<view class="func-list">
			<view class="func" v-for="(item,index) in funcList" :key="index + item" @click="func(index)">{{item}}</view>
			<view class="func top" @click="toTop">回到顶部</view>
		</view>
	</view>
</template>
<script>
	import NavBar from '@/components/nav-bar/nav-bar.vue'
	export default {
		components: { NavBar },
		data() {
			return {
				loadingTimer: null,
				funcList: [
					'振动',
					'网络',
					'系统主题',
					'分享',
					'推送',
					'loading',
					'占位',
					'占位',
					'占位',
					'占位',
					'占位',
					'占位',
					'占位',
					'占位',
					'占位',
					'占位',
					'占位',
					'占位',
					'占位',
					'占位'
				]
			}
		},
		methods: {
			func(inx) {
				switch (inx) {
					case 0: 
						this.vibrate()
						break;
					case 1:
						this.netstatus()
						break;
					case 2:
						this.theme()
						break;
					case 3:
						this.share()
						break;
					case 4:
						this.push()
						break;
					case 5:
						this.loading()
						break;
				}
			},
			vibrate () {
				uni.vibrateShort({
				    success: function () {
				        console.log('success');
				    }
				});
			},
			push () {
				const msgtxt = '这是一条消息提示'
				const options = {
					type: 1,
					msg: '额外参数'
				}
				//已对象的形式传参，ios无法获取到参数，JSON字符可以获取
				plus.push.createMessage(msgtxt, JSON.stringify(options))
			},
			theme() {
				uni.showActionSheet({
				    itemList: ['日间', '暗黑', '自动'],
				    success: function (res) {
				        console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
						const style = res.tapIndex == 0 ? 'light' : res.tapIndex === 1 ? 'dark' : 'auto'
						plus.nativeUI.setUIStyle(style);
				    },
				    fail: function (res) {
				        console.log(res.errMsg);
				    }
				});
			},
			share () {
				const _this = this
				uni.showActionSheet({
				    itemList: ['分享文字', '分享图片', '分享图文'],
				    success: function (res) {
						_this.shareIt(res.tapIndex)
				    },
				    fail: function (res) {
				        console.log(res.errMsg);
				    }
				});
			},
			shareIt (inx) {
				const opt = {
					provider: "weixin",
					scene: "WXSceneSession",
					type: inx + 1,
				}
				if (inx == 0) {
					opt.summary = 'uni-app和flutter你pick那个'
				}
				if (inx == 1) {
					opt.imageUrl = 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uni-app-doc/d8590190-4f28-11eb-b680-7980c8a877b8.png'
				}
				if (inx == 2) {
					opt.type = 0
					opt.href = 'href: "http://uniapp.dcloud.io/'
					opt.title = 'uni-app和flutter你pick那个'
					opt.summary = '我正在使用HBuilderX开发uni-app，赶紧跟我一起来体验！'
					opt.imageUrl = 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uni-app-doc/d8590190-4f28-11eb-b680-7980c8a877b8.png'
				}
				uni.share({
					...opt,
				    success: function (res) {
				        console.log("success:" + JSON.stringify(res));
				    },
				    fail: function (err) {
				        console.log("fail:" + JSON.stringify(err));
				    }
				});
			},
			netstatus () {
				uni.getNetworkType({
				    success: function (res) {
						uni.showModal({
							title: '当前网络状态',
							content: res.networkType,
							success(res) {
									if (res) {
										console.log('ok')
									} else {
										console.log('cancel')
									}
							},
							fail() {
								console.log('ok')
							}
						})
				        console.log(res.networkType);
				    }
				});
			},
			loading () {
				uni.showLoading({
				    title: '振动'
				});
				const loadingTimer = setTimeout(() => {
					uni.hideLoading()
				},500)
			},
			toTop() {
				uni.pageScrollTo({
				    scrollTop: 0,
				    duration: 300
				});
			}
		},
		onLoad() {
			
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.func-list {
		width: 100%;
		display: flex;
		flex-direction: column;
	}
	.func {
		width: 100%;
		height: 80rpx;
		margin-bottom: 20rpx;
		background-color: #eee;
		text-align: center;
		line-height: 80rpx;
	}
	.top {
		background-color: #2589FF;
		color: #FFFFFF;
	}
</style>
